//订单管理 - 补扣二级页面

import React, { Component } from 'react';
import { Form, Col, Row, InputNumber, Button, Tag, Icon } from 'antd';

const FormItem = Form.Item;

class Supplement extends Component {
  render() {
    const { getFieldDecorator } = this.props.form;

    return (
      <div>
        <Form>
          <FormItem>
            <Row>
              <Col span={3}>
                补扣金额
              </Col>
              <Col span={21}>
                {getFieldDecorator('xzMoney', {
                  rules: [{ required: true, message: 'Please input your xzMoney!' }],
                })(
                  <InputNumber  style={{ color: 'rgba(0,0,0,.25)', width: '100%' }} />
                )} 
              </Col>
            </Row>              
          </FormItem>
          <FormItem>
            <Row>
              <Col span={24}>
                <Tag color="orange" style={{width: '100%', height: '40px', paddingLeft: '15px', paddingTop: '8px'}}>
                  <Icon style={{marginRight: '15px'}} type="exclamation-circle" theme="filled" />
                  当前订单应还款额为1500元
                </Tag>
              </Col>              
            </Row>   
          </FormItem>
          <FormItem>
            <Row>
              <Col span={3}></Col>
              <Col span={21}>
                <Button style={{marginRight: 8}}>取消</Button>
                <Button type="primary" htmlType="submit">确认</Button>
              </Col>
            </Row>   
          </FormItem>
        </Form>
      </div>
    );
  }
}

const SupplementForm = Form.create()(Supplement);

export default SupplementForm;